<template>
  <el-select v-model="selectedVal" :placeholder="placeholder" @change="handleChange">
    <el-option
      v-for="item in options"
      :key="item.id"
      :label="item.name"
      :value="item.appId" />
  </el-select>
</template>
<script>
// import docAnalysisService from "@/service/doc-analysis"
export default {
  props: {
    value: {
      type: String,
      default: ''
    },
    placeholder: {
      type: String,
      default: '请选择'
    },
    type: {
      type: Number,
      default: 1
    }
  },
  data() {
    return {
      selectedVal: '',
      options: []
    }
  },
  watch: {
    value: function(val) {
      setTimeout(() => {
        this.selectedVal = val
      }, 200)
    },
    selectedVal: function(val) {
      this.$emit('input', val)
    }
  },
  mounted() {
    this.initData()
  },
  created() {
    this.selectedVal = this.value
  },
  methods: {
    async initData() {
      try {
        const response = await this.$store.dispatch('applicationKeyConfigList', { type: this.type })
        this.options = response
        if (response.length > 0) {
          this.selectedVal = response[0].appId
          this.handleChange()
        }
      } catch (_) {
        console.log()
      }
      // this.treeData = response
    },
    handleChange() {
      var selected = this.options.filter((item) => {
        return item.appId === this.selectedVal
      })
      this.$emit('change', selected[0])
    },
    refresh() {
      this.initData()
    }
  }
}
</script>
<style lang="scss">
</style>
